import 'package:bxultimate/app/theme/gaps.dart';
import 'package:bxultimate/widgets/mk_load_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter/scheduler.dart';
import 'package:flutter/services.dart';
import 'package:flutter_widget_from_html/flutter_widget_from_html.dart';
import 'package:get/get.dart';
import 'package:tdesign_flutter/tdesign_flutter.dart';

/// 搜索页的AppBar
class MkSearchBar extends StatefulWidget implements PreferredSizeWidget {
  const MkSearchBar(
      {super.key,
      this.hintText = '',
      this.backImg = 'assets/images/ic_back_black.png',
        this.autoFocus = false,
      this.onPressed,
        this.showBack=true,
      this.onTap, this.editingController});

  final TextEditingController? editingController;
  final String backImg;
  final String hintText;
  final bool autoFocus;
  final bool showBack;
  final Function(String)? onPressed;
  final GestureTapCallback? onTap;

  @override
  _MkSearchBarState createState() => _MkSearchBarState();

  @override
  Size get preferredSize => const Size.fromHeight(48.0);
}

class _MkSearchBarState extends State<MkSearchBar> {
  final FocusNode _focus = FocusNode();

  @override
  void dispose() {
    _focus.dispose();
    super.dispose();
  }

  // @override
  // void initState() {
  //   WidgetsBinding.instance!.addPostFrameCallback((_) async {
  //     SystemChannels.textInput.invokeMethod<void>('TextInput.updateConfig', const TextInputConfiguration().toJson());
  //     SystemChannels.textInput.invokeMethod<void>('TextInput.hide');
  //   });
  //   super.initState();
  // }

  @override
  Widget build(BuildContext context) {
    final bool isDark = Get.isDarkMode;

    final Widget back = Semantics(
      label: '返回',
      child: SizedBox(
        width: 48.0,
        height: 48.0,
        child: InkWell(
          onTap: () {
            _focus.unfocus();
            Navigator.maybePop(context);
          },
          borderRadius: BorderRadius.circular(24.0),
          child: Padding(
            key: const Key('search_back'),
            padding: const EdgeInsets.only(left: 12),
            child: Icon(Icons.arrow_back_ios),
          ),
        ),
      ),
    );

    /// 使用2.0.0新增CupertinoSearchTextField 实现， 需添加依赖 cupertino_icons: ^1.0.2
    // final Widget textField1 = Expanded(child: Container(
    //     height: 32.0,
    //     child: CupertinoSearchTextField(
    //       key: const Key('search_text_field'),
    //       controller: _controller,
    //       focusNode: _focus,
    //       placeholder: widget.hintText,
    //       placeholderStyle: Theme.of(context).inputDecorationTheme.hintStyle,
    //       padding: const EdgeInsetsDirectional.fromSTEB(3.8, 0, 5, 0),
    //       prefixInsets: const EdgeInsetsDirectional.fromSTEB(8, 0, 0, 0),
    //       suffixInsets: const EdgeInsetsDirectional.fromSTEB(0, 0, 8, 0),
    //       style: Theme.of(context).textTheme.subtitle1,
    //       itemSize: 16.0,
    //       itemColor: iconColor,
    //       decoration: BoxDecoration(
    //         color: isDark ? Colours.dark_material_bg : Colours.bg_gray,
    //         borderRadius: BorderRadius.circular(4.0),
    //       ),
    //       onSubmitted: (String val) {
    //         _focus.unfocus();
    //         // 点击软键盘的动作按钮时的回调
    //         widget.onPressed(val);
    //       },
    //     )
    // ));

    final Widget textField = Expanded(
      child: Container(
        height: 32.0,
        padding: EdgeInsets.only(left: 2),
        decoration: BoxDecoration(
            // color: isDark ? Colours.dark_material_bg : Colours.bg_gray,
            borderRadius: BorderRadius.circular(31.0),
            border: Border.all(width: 1, color: Color(0xFFFF8362)),
            color: Colors.white),
        child: Row(children: [
          Expanded(
              child: TextField(
            key: const Key('search_text_field'),
            controller: widget.editingController,
            focusNode: _focus,
            autofocus: widget.autoFocus,
            textInputAction: TextInputAction.search,
            onSubmitted: (String val) {
              _focus.unfocus();
              // 点击软键盘的动作按钮时的回调
              widget.onPressed?.call(val);
            },
            decoration: InputDecoration(
                contentPadding: const EdgeInsets.only(
                    left: 16.0, right: -16.0, bottom: 12.0),
                // 圆角边框
                hintText: widget.hintText,
                border: InputBorder.none),
          )),
          TDButton(
            text: '搜索',
            width: 70,
            theme: TDButtonTheme.primary,
            shape: TDButtonShape.round,
            size: TDButtonSize.small,
            onTap: () {
              _focus.unfocus();
              widget.onPressed?.call(widget.editingController!.text);
            },
          )
        ]),
      ),
    );

    final Widget textNoEdit = Expanded(
      child: Container(
        height: 32.0,
        padding: EdgeInsets.only(left: 2, right: 0),
        decoration: BoxDecoration(
            // color: isDark ? Colours.dark_material_bg : Colours.bg_gray,
            borderRadius: BorderRadius.circular(31.0),
            border: Border.all(width: 1, color: Color(0xFFFF8362)),
            color: Colors.white),
        child: Row(children: [
          Expanded(child: SizedBox()),
          TDButton(
            text: '搜索',
            width: 70,
            theme: TDButtonTheme.primary,
            shape: TDButtonShape.round,
            size: TDButtonSize.small,
            onTap: () {
              _focus.unfocus();
              widget.onPressed?.call(widget.editingController!.text);
            },
          )
        ]),
      ),
    );

    final Widget wrap = SafeArea(
      child: Row(
        children: <Widget>[
          widget.showBack ? back :SizedBox(),
          textField,
          Gaps.hGap12,
        ],
      ),
    );

    return Material(

      color: Colors.transparent,
      // color: Get.theme.scaffoldBackgroundColor,
      child: widget.onTap != null
          ? InkWell(
              onTap: widget.onTap,
              child: SafeArea(
                child: Row(
                  children: <Widget>[
                    Gaps.hGap12,
                    textNoEdit,
                    Gaps.hGap12,
                  ],
                ),
              ),
            )
          : wrap,
    );
  }
}
